<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

<link rel="stylesheet" href="css/bootstrap-3.3.7/css/bootstrap.min.css" />
<link rel="stylesheet" href="css/bootstrap-3.3.7/css/bootstrap-datetimepicker.min.css" />
<link rel="stylesheet" href="css/font-awesome-4.7.0/css/font-awesome.css" />
<link rel="stylesheet" href="css/newListcommon.css" />
<link rel="stylesheet" href="css/maintenanceForm.css" />
<div class="pageContent maintenanceFormList">
    <!--查询-->
    <div class="searchContent">
        <form action="">
            <div class="searchTitle">
                <h4>查询条件</h4>
            </div>
            <div class="searchBox">
                <div class="row">
                    <div class="col-xs-6">
                        <label for="">任务名称:</label>
                        <input type="text" placeholder="请输入任务名称"/>
                    </div>
                    <div class="col-xs-6">
                        <label for="">审批环节:</label>
                        <input type="text" placeholder="请输入审批环节"/>
                    </div>
                    <div class="col-xs-6">
                        <label for="">发起日期:</label>
                        <input name="scheduledTime" type="datetime-local" class="form-control">
                    </div>
                    <div class="col-xs-6">
                        <label for="">发起人:</label>
                        <input type="text" placeholder="请输入发起人"/>
                    </div>
                    <div class="col-xs-6">
                        <label for="">所属站点:</label>
                        <input type="text" placeholder="请输入所属站点"/>
                    </div>
                    <div class="col-xs-6">
                        <label for="">所属部门:</label>
                        <select name="type" class="form-control">
                            <option>请选择所属部门</option>

                        </select>
                    </div>
                    <div class="col-xs-12">
                        <button class="theQuery">查询</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <!--列表-->
    <div class="listContent">
        <div class="searchTitle">
            <h4>代办列表</h4>
                <a id="closeSearch"><i class="glyphicon glyphicon-search"></i>展开查询</a>
        </div>
        <!--表格-->
        <div class="tableWrap">
            <table class="table-bordered">
                <thead>
                <tr>
                    <th width="5%">序号</th>
                    <th>任务名称</th>
                    <th>审批环节</th>
                    <th>发起人</th>
                    <th>所属公司</th>
                    <th>所属部门</th>
                    <th>发起日期</th>
                    <th>操作</th>
                </tr>
                </thead>
                <c:forEach items="${requestScope.tasklist}" var="task" varStatus="status">
                    <tr>
                        <td>${status.count}</td>
                        <td>${task.businessTitle}</td>
                        <td>${task.name}</td>
                        <td>${task.assignee}</td>
                        <td>${task.companyName}</td>
                        <td>${task.departmentName}</td>
                        <td><fmt:formatDate value="${task.createTime}" pattern="yyyy-MM-dd HH:mm:ss"/></td>
                        <td class="operation">
                            <div class="btn-group">
                                <a  href="${task.businessUrl}&processInstanceId=${task.processInstanceId}&id=${task.id}"><i class="fa fa-edit"></i>审批</a>
                            </div>
                        </td>
                    </tr>
                </c:forEach>

            </table>
        </div>
    </div>
    <!--引用分页-->
</div>
<script src="js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">

    //关闭查询
    $("#closeSearch").click(function(){
        if($(".searchContent").css("display")=="none"){
            $(".searchContent").show();
            $("#closeSearch").html('关闭查询');
        }else{
            $(".searchContent").hide();
            $("#closeSearch").html('展开查询');
        }
    })
</script>
